<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<jsp:include page = "../metadatos.jsp" flush = "True" />
<html>
    <head>
        <title>ACTIVIDADES</title>
    </head>
    <body>
        <div class="wrapper">
            <header class="header">
                <img src="./resources/Logo.PNG" />
            </header>
            <jsp:include page = "../menuNavegacion.jsp" flush = "True" />
            <main class="content">
                <fieldset>
                    <legend>ss</legend>
                    <form method="post" action="Calendario?action=addEvent&index=1" class="formee">
                        <div class="formee-msg-error">
                            <c:if test="${principalCalendario.errores != null}">
                                <ul class="listaErrores" class="listaErrores">
                                    <c:forEach items="${principalCalendario.errores}" var="error">
                                        <li><c:out value="${error}"/></li>
                                        </c:forEach>
                                </ul>
                            </c:if>
                        </div>
                        <input type="hidden" name="date" value="<c:out value="${principalCalendario.fechaApuntador}"/>"/>
                        <div class="grid-6-12">
                            Seleccione Hora Inicio:
                            <select name="horaInicio">
                                <option value="Selecione Hora Inicio">Selecione Hora Inicio</option>
                                <option value="1">9:00 AM</option>
                                <option value="2">9:30 AM</option>
                                <option value="3">10:00 AM</option>
                                <option value="4">10:30 AM</option>
                                <option value="5">11:00 AM</option>
                                <option value="6">11:30 AM</option>
                                <option value="7">12:00 PM</option>
                                <option value="8">12:30 PM</option>
                                <option value="9">13:00 PM</option>
                                <option value="10">13:30 PM</option>
                                <option value="11">14:00 PM</option>
                                <option value="12">14:30 PM</option>
                                <option value="13">15:00 PM</option>
                                <option value="14">15:30 PM</option>
                                <option value="15">16:00 PM</option>
                                <option value="16">16:30 PM</option>
                                <option value="17">17:00 PM</option>
                                <option value="18">17:30 PM</option>
                                <option value="19">18:00 PM</option>
                                <option value="20">18:30 PM</option>
                                <option value="21">19:00 PM</option>
                                <option value="22">19:30 PM</option>
                            </select>
                        </div>
                        <div class="grid-6-12">
                            Seleccione Hora Fin:
                            <select name="horaFin" class="grid-6-12">
                                <option value="Selecione Hora Fin">Selecione Hora Fin</option>
                                <option value="1">9:00 AM</option>
                                <option value="2">9:30 AM</option>
                                <option value="3">10:00 AM</option>
                                <option value="4">10:30 AM</option>
                                <option value="5">11:00 AM</option>
                                <option value="6">11:30 AM</option>
                                <option value="7">12:00 PM</option>
                                <option value="8">12:30 PM</option>
                                <option value="9">13:00 PM</option>
                                <option value="10">13:30 PM</option>
                                <option value="11">14:00 PM</option>
                                <option value="12">14:30 PM</option>
                                <option value="13">15:00 PM</option>
                                <option value="14">15:30 PM</option>
                                <option value="15">16:00 PM</option>
                                <option value="16">16:30 PM</option>
                                <option value="17">17:00 PM</option>
                                <option value="18">17:30 PM</option>
                                <option value="19">18:00 PM</option>
                                <option value="20">18:30 PM</option>
                                <option value="21">19:00 PM</option>
                                <option value="22">19:30 PM</option>
                            </select>
                        </div>
                        <div class="grid-12-12"
                             Describa el Evento:
                             <textarea name="descripcion" class="grid-12-12"></textarea>
                        </div>
                        <input type="submit" value="Agregar Nuevo">

                        <div class="grid-12-12">
                            <table border="1" class="bordered">
                                <thead>
                                <th>ID</th>
                                <th>User ID</th>
                                <th>Hora Inicio</th>
                                <th>Hora Fin</th>
                                <th>Evento Fecha</th>
                                <th>Descripcion</th>
                                </thead>
                                <tbody>
                                    <c:forEach items="${principalCalendario.eventosDia}" var="reg">
                                        <tr>
                                            <td><c:out value="${reg.id}"/></td>
                                            <td><c:out value="${reg.userId}"/></td>
                                            <c:if test="${reg.horaEventoInicio==1}"><td>9:00 AM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==2}"><td>9:30 AM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==3}"><td>10:00 AM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==4}"><td>10:30 AM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==5}"><td>11:00 AM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==6}"><td>11:30 AM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==7}"><td>12:00 PM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==8}"><td>12:30 PM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==9}"><td>13:00 PM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==10}"><td>13:30 PM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==12}"><td>14:00 PM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==13}"><td>15:00 PM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==14}"><td>15:30 PM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==15}"><td>16:00 PM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==16}"><td>16:30 PM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==17}"><td>17:00 PM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==18}"><td>17:30 PM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==19}"><td>18:00 PM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==20}"><td>18:30 PM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==21}"><td>19:00 PM</td></c:if>
                                            <c:if test="${reg.horaEventoInicio==22}"><td>19:30 PM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==1}"><td>9:00 AM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==2}"><td>9:30 AM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==3}"><td>10:00 AM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==4}"><td>10:30 AM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==5}"><td>11:00 AM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==6}"><td>11:30 AM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==7}"><td>12:00 PM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==8}"><td>12:30 PM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==9}"><td>13:00 PM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==10}"><td>13:30 PM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==12}"><td>14:00 PM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==13}"><td>15:00 PM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==14}"><td>15:30 PM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==15}"><td>16:00 PM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==16}"><td>16:30 PM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==17}"><td>17:00 PM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==18}"><td>17:30 PM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==19}"><td>18:00 PM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==20}"><td>18:30 PM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==21}"><td>19:00 PM</td></c:if>
                                            <c:if test="${reg.horaEventoFin==22}"><td>19:30 PM</td></c:if>
                                            <td><c:out value="${reg.fechaEvento}"/></td>
                                            <td><c:out value="${reg.descripcion}"/></td>
                                        </tr>
                                    </c:forEach>
                                </tbody>
                            </table>
                        </div>
                </fieldset>
                </form>
                </body>
                </html>
